<nz-modal [(nzVisible)]="isVisible" [nzMaskClosable]="false" [nzTitle]="courseTeacher.id ? '开课信息详情' : '新增开课信息'"
  (nzOnCancel)="handleCancel()" [nzFooter]="detailFooter" nzWidth="1200">

  <form nz-form [formGroup]="validateForm" #myForm="ngForm">
    <div nz-row [nzGutter]="16">
      <b style="color: red;">基本信息</b>
      <nz-divider nzType="horizontal"></nz-divider>
      <div nz-col [nzSpan]="7">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="year" nzRequired>学年</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback [nzErrorTip]="yearErrorTpl">
            <nz-year-picker [(ngModel)]="courseTeacher.year" formControlName="year" [nzFormat]="'yyyy' + '年度'"
              nzPlaceHolder="起始学年必填" *ngIf="!isPreView; else yearTemp">
            </nz-year-picker>
            <ng-template #yearErrorTpl let-control>
              <ng-container *ngIf="control.hasError('required')">
                请选择学年!
              </ng-container>
            </ng-template>
            <ng-template #yearTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.year + ' - ' + courseTeacher?.nextYear + '学年' }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="termType" nzRequired>学期</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback [nzErrorTip]="termTypeErrorTpl">
            <nz-select [(ngModel)]="courseTeacher.termType" formControlName="termType" nzAllowClear nzPlaceHolder="学期必填"
              *ngIf="!isPreView; else termTypeTemp">
              <nz-option nzValue="LAST_TERM" nzLabel="第一学期"></nz-option>
              <nz-option nzValue="NEXT_TERM" nzLabel="第二学期"></nz-option>
            </nz-select>
            <ng-template #termTypeErrorTpl let-control>
              <ng-container *ngIf="control.hasError('required')">
                请选择学期!
              </ng-container>
            </ng-template>
            <ng-template #termTypeTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.termType === 'LAST_TERM' ? '第一学期' : '第二学期' }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label nzFor="evaluationMode" nzRequired [nzSpan]="10">考核方式</nz-form-label>
          <nz-form-control nz-col [nzSpan]="14" nzHasFeedback [nzErrorTip]="evaluationModeErrorTpl">
            <nz-select [(ngModel)]="courseTeacher.evaluationMode" formControlName="evaluationMode" nzAllowClear
              nzPlaceHolder="请选择考核方式" *ngIf="!isPreView; else evaluationModeTemp">
              <nz-option nzValue="考试" nzLabel="考试"></nz-option>
              <nz-option nzValue="考查" nzLabel="考查"></nz-option>
            </nz-select>
            <ng-template #evaluationModeErrorTpl let-control>
              <ng-container *ngIf="control.hasError('required')">
                考核方式必填!
              </ng-container>
            </ng-template>
            <ng-template #evaluationModeTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.evaluationMode }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>


    <div nz-row [nzGutter]="24">
      <div nz-col [nzSpan]="7">
        <nz-form-item nzFlex nz-row>
          <nz-form-label nzFor="isOpen" nzRequired [nzSpan]="10">是否开课</nz-form-label>
          <nz-form-control nz-col [nzSpan]="14">
            <nz-radio-group [(ngModel)]="courseTeacher.isOpen" formControlName="isOpen" nzAllowClear
              nzPlaceHolder="请选择是否开课" *ngIf="!isPreView; else isOpenTemp">
              <label nz-radio [nzValue]="true">是</label>
              <label nz-radio [nzValue]="false">否</label>
            </nz-radio-group>
            <ng-template #isOpenTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.isOpen ? '是': '否' }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>

    <div nz-row [nzGutter]="24">
      <b style="color: red;">课程信息</b>
      <nz-divider nzType="horizontal"></nz-divider>
      <div nz-col [nzSpan]="7">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="courseName" nzRequired>课程名称</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback>
            <app-grid-select name="courseName" [data]="courseList" [columns]="courseColumns"
              [gridText]="courseTeacher.course.name" [gridTextType]="'name'" [placeHolder]="'请选择课程'"
              (select)="getCourseChange($event)" *ngIf="!isPreView; else courseTemp">
            </app-grid-select>
            <ng-template #courseTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.course?.name }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzRequired>课程类型</nz-form-label>
          <nz-form-control [nzSpan]="14">
            <input nz-input formControlName="courseType"
              [ngModel]="courseTeacher?.course?.courseType?.courseBaseType
            ? courseTeacher?.course?.courseType?.name + '/' + [courseTeacher?.course?.courseType?.courseBaseType === 'REQUIRED_COURSE' ? '必修课' 
            : courseTeacher?.course?.courseType?.courseBaseType === 'OPTIONAL_COURSE' ? '任选课'
            : courseTeacher?.course?.courseType?.courseBaseType === 'RESTRICTED_COURSE' ? '限选课' : '']  : courseTeacher?.course?.courseType?.name"
              placeholder="未选择课程" *ngIf="!isPreView; else courseTypeTemp">
            <ng-template #courseTypeTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ 
                   courseTeacher?.course?.courseType?.courseBaseType
          ? courseTeacher?.course?.courseType?.name + '/' + [courseTeacher?.course?.courseType?.courseBaseType === 'REQUIRED_COURSE' ? '必修课' 
          : courseTeacher?.course?.courseType?.courseBaseType === 'OPTIONAL_COURSE' ? '任选课'
          : courseTeacher?.course?.courseType?.courseBaseType === 'RESTRICTED_COURSE' ? '限选课' : '']  : courseTeacher?.course?.courseType?.name}}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzRequired>课程修读学分</nz-form-label>
          <nz-form-control [nzSpan]="14">
            <input nz-input formControlName="credit" [(ngModel)]="courseTeacher.course.credit" placeholder="未选择课程"
              *ngIf="!isPreView; else creditTemp">
            <ng-template #creditTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.course?.credit }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>

        </nz-form-item>
      </div>
    </div>

    <div nz-row [nzGutter]="24">
      <b style="color: red;">教师信息</b>
      <nz-divider nzType="horizontal"></nz-divider>
      <div nz-col [nzSpan]="7">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="teacherCode" nzRequired>教师编号</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback>
            <app-grid-select name="teacherCode" [data]="teacherList" [columns]="teacherColumns"
              [gridText]="courseTeacher.teacher.code" [gridTextType]="'code'" [placeHolder]="'请选择授课教师'"
              (select)="getTeacherChange($event)" *ngIf="!isPreView; else teacherCodeTemp">
            </app-grid-select>
            <ng-template #teacherCodeTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.teacher?.code }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="teacherName" nzRequired>教师名称</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback>
            <input nz-input formControlName="teacherName" [ngModel]="courseTeacher.teacher.name" placeholder="未选择教师"
              *ngIf="!isPreView; else teacherNameTemp">
            <ng-template #teacherNameTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.teacher?.name }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item nzFlex nz-row>
          <nz-form-label [nzSpan]="10" nzFor="degreeType" nzRequired>教师学历</nz-form-label>
          <nz-form-control [nzSpan]="14" nzHasFeedback>
            <input nz-input formControlName="degreeType" [ngModel]="courseTeacher?.teacher?.degreeType === 'MIDDLE_SCHOOL'
                    ? '初中'
                    : courseTeacher?.teacher?.degreeType === 'SECONDARY'
                    ? '中专'
                    : courseTeacher?.teacher?.degreeType === 'HIGH_SCHOOL'
                    ? '高中'
                    : courseTeacher?.teacher?.degreeType === 'ASSOCIATE'
                    ? '大专'
                    : courseTeacher?.teacher?.degreeType === 'BACHELOR'
                    ? '本科'
                    : courseTeacher?.teacher?.degreeType === 'GRADUATE'
                    ? '研究生'
                    : courseTeacher?.teacher?.degreeType === 'DOCTORAL'
                    ? '博士'
                    : courseTeacher?.teacher?.degreeType === 'POST_DOCTORAL'
                    ? '博士后'
                    : ''" placeholder="未选择教师" *ngIf="!isPreView; else degreeTypeTemp">
            <ng-template #degreeTypeTemp>
              <div class="editable-cell">
                <div class="editable-cell-value-wrap text-truncate">
                  {{ courseTeacher?.teacher?.degreeType === 'MIDDLE_SCHOOL'
                    ? '初中'
                    : courseTeacher?.teacher?.degreeType === 'SECONDARY'
                    ? '中专'
                    : courseTeacher?.teacher?.degreeType === 'HIGH_SCHOOL'
                    ? '高中'
                    : courseTeacher?.teacher?.degreeType === 'ASSOCIATE'
                    ? '大专'
                    : courseTeacher?.teacher?.degreeType === 'BACHELOR'
                    ? '本科'
                    : courseTeacher?.teacher?.degreeType === 'GRADUATE'
                    ? '研究生'
                    : courseTeacher?.teacher?.degreeType === 'DOCTORAL'
                    ? '博士'
                    : courseTeacher?.teacher?.degreeType === 'POST_DOCTORAL'
                    ? '博士后'
                    : '无' }}
                </div>
              </div>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
  </form>

  <ng-template #detailFooter>
    <button nz-button nzType="primary" (click)="save()" *ngIf="!isPreView" [nzLoading]="loading">
      <span>保存</span>
    </button>
    <button nz-button nzType="default" (click)="handleCancel()">关闭</button>
  </ng-template>
</nz-modal>
